import React,{lazy,Suspense} from 'react';
import {connect} from 'react-redux';
import HeadNavComponent from "../../../components/headNav";
import OrderNav from '../../../components/order/index';
import {LocalParam,AuthRoute} from '../../../assets/js/utils/index';
import {Switch,Route} from 'react-router-dom';
import Css from '../../../assets/css/user/order/index.css';
const orderOrder=lazy(()=>import('./order.js'));
const orderReview=lazy(()=>import('./review.js'));

class orderIndex extends React.Component{
    constructor(props){
        super(props);
        AuthRoute(props);
        this.state={
            status:LocalParam(props.location.search).search.status?LocalParam(props.location.search).search.status:'',
            title:'全部订单'
        }
    }

    componentDidMount(){
        this.getTitle()
    }
    UNSAFE_componentWillReceiveProps(newProps){
        this.setState({status:LocalParam(newProps.location.search).search.status},()=>{
            this.getTitle()
        })
    }
    //改变title
    getTitle(){
        switch (this.state.status) {
            case 'all':
                this.setState({title:'全部订单'});
                break;
            case '0':
                this.setState({title:'待付款'});
                break;
            case '1':
                this.setState({title:'待收货'});
                break;
            case '2':
                this.setState({title:'待评价'});
                break;
            default:
                this.setState({title:'全部订单'});
                break;

        }
    }
    componentWillUnmount(){
        this.setState = (state, callback) => {
            return;
        };
    }
    render(){
        return(
            <div className={Css['main']}>
                <HeadNavComponent title={this.state.title}></HeadNavComponent>
                <OrderNav></OrderNav>
                <div className={Css['main_router']}>
                    <Suspense fallback={<React.Fragment />}>
                        <Switch>
                            <Route path={window.base.config.path+'order/order'} component={orderOrder}/>
                            <Route path={window.base.config.path+'order/review'} component={orderReview}/>
                        </Switch>
                    </Suspense>
                </div>
            </div>
        )
    }
}
export default connect((state)=>{
    return{
        state:state
    }
})(orderIndex)